<template>
  <PageContainer>
    <view class="container">
      <Header
        :title="`${supplyDemandDetailsResult?.boType === BoTypeEnum.Supply ? '供应' : '需求'}详情`"
      />
      <StatusView
        :reviewStatus="supplyDemandDetailsResult?.reviewStatus"
        :review-content="supplyDemandDetailsResult?.reviewContent"
      ></StatusView>
      <DetailsView :data="supplyDemandDetailsResult" :hide-statistics="true"></DetailsView>
      <PersonnelInfo
        v-bind="supplyDemandDetailsResult"
        title="发布人信息"
        :phone-number="supplyDemandDetailsResult?.phone"
      ></PersonnelInfo>
    </view>
    <BusinessOpportunitieSet
      action-type="review"
      ref="businessOpportunitieSetRef"
      :id="id"
      @ok="handleOk"
    ></BusinessOpportunitieSet>
    <ShowModal
      v-model="modalVisible"
      title="驳回申请"
      content-width="100%"
      confirm-text="立即驳回"
      confirm-color="#EA5E0E"
      @confirm="handleRejected"
    >
      <template #content>
        <view class="pa-20" style="width: 100%">
          <view class="pb-16 fz-14" style="color: #999996">告知一下用户为什么会被驳回吧</view>
          <view style="background-color: #f2f3f5">
            <UniEasyinput v-model="remark" type="textarea" placeholder="请输入审核说明" />
          </view>
        </view>
      </template>
    </ShowModal>
    <TButtonGroup
      v-if="supplyDemandDetailsResult?.reviewStatus === ReviewStatus.Pending"
      :styles="{ backgroundColor: '#fff' }"
    >
      <TButton class="gutter-btn" text="驳回申请" type="warn" @click="modalVisible = true" />
      <TButton class="gutter-btn" text="同意发布" type="primary" @click="handleAgree" />
    </TButtonGroup>
    <ShowModal
      v-model="openShare"
      title="供需发布成功！"
      content-width="100%"
      cancel-text="暂不推广"
      confirm-text="立即分享"
      confirm-color="#EA5E0E"
      content="帮TA推广一下吧~"
      :confirm-auto-close="false"
      @confirm="handleShowShare"
      @close="handleClose"
    ></ShowModal>

    <CustomShare v-model:visible="showSharePopup" @register="handleCustomShareregister" />
  </PageContainer>
</template>

<script lang="ts" setup>
  /* businessOpportunitieAuditDetail 供需详情 */
  import Header from '@/components/Header/index.vue';
  import PageContainer from '@/components/PageContainer/index.vue';
  import DetailsView from '../../components/DetailsView.vue';
  import PersonnelInfo from '../../components/PersonnelInfo.vue';
  import TButtonGroup from '@/components/TButtonGroup/index.vue';
  import TButton from '@/components/TButtonGroup/TButton.vue';
  import BusinessOpportunitieSet from '../components/BusinessOpportunitieSet/index.vue';
  import { getUrl, navigateBack, onLoad } from '@/router';
  import { ref, watchEffect } from 'vue';
  import type { FunctionArgs } from '@vueuse/core';
  import UniEasyinput from '@/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue';
  import { boReview, boReviewDetail } from '@/api/businessOpportunities';
  import { ReviewStatus } from '@/enums/businessOpportunitiesEnum';
  import type { ISupplyDemandDetailsResult } from '@/api/businessOpportunities/type';
  import { Toast } from '@/utils';
  import { BoTypeEnum } from '@/enums/businessOpportunitiesEnum';
  import StatusView from './components/StatusView.vue';
  import { onShareAppMessage } from '@dcloudio/uni-app';
  import { useAppShare } from '@/hooks/core/useAppShare';
  import ShowModal from '@/components/ShowModal/index.vue';
  import { useCustomShare } from '@/components/CustomShare/hooks/useCustomShare';
  import { getSupplyDemandPosterData, getSupplyDemandWxShareData } from '../../components/utils';
  import { addAppShareLog, boUserPromotionCountDataAdd } from '@/api';
  import { createMiniCode } from '@/utils/dynamicConfig';
  import CustomShare from '@/components/CustomShare/index.vue';
  import { BusinessFunctionTypeEnum } from '@/enums/publicModuleEnum';
  import type { BusinessOpportunitieAuditDetail } from '@/router/types/modules';

  const id = ref();
  let successFn: BusinessOpportunitieAuditDetail['successFn'];
  const businessOpportunitieSetRef = ref<InstanceType<typeof BusinessOpportunitieSet>>();

  onLoad<'businessOpportunitieAuditDetail'>((op) => {
    id.value = op.id;
    successFn = op.successFn;
    getDtail();
  });
  const supplyDemandDetailsResult = ref<ISupplyDemandDetailsResult & { boInfoId: number }>();
  const getDtail = async () => {
    supplyDemandDetailsResult.value = await boReviewDetail(id.value);
  };
  const handleAgree = () => {
    businessOpportunitieSetRef.value?.open(supplyDemandDetailsResult.value!.boInfoId);
  };
  const modalVisible = ref(false);
  const remark = ref('');
  const handleRejected = async () => {
    await boReview({
      id: id.value,
      reviewStatus: ReviewStatus.Rejected,
      reviewContent: remark.value,
    });
    modalVisible.value = false;
    Toast({
      title: '已驳回供需信息发布申请',
      duration: 1000,
      success: () => {
        successFn?.();
        navigateBack();
      },
    });
  };
  const openShare = ref(false);
  const handleOk = () => {
    successFn?.();
    getDtail();
    openShare.value = true;
  };

  const handleClose = () => {
    navigateBack();
  };

  /** 分享弹窗 */
  const showSharePopup = ref(false);

  function handleShowShare() {
    boUserPromotionCountDataAdd({
      type: BusinessFunctionTypeEnum.BO,
      dataId: supplyDemandDetailsResult.value?.boInfoId!,
    });
    showSharePopup.value = true;
  }

  const [
    register,
    { setWxShareOptions, setShareLogId, setPosterDrawData, setInternalLinkOptions },
  ] = useCustomShare({
    buttons: {
      share: true,
      poster: true,
      timeline: false,
      copyLink: true,
      insertOffiaccount: true,
      offiaccount: true,
    },
    disableds: {
      shortLink: true,
    },
  });
  function handleCustomShareregister(e: any) {
    register(e);
    customShareLoading.value = true;
  }
  const { setWxSharePath, createShareQuery, setWxShareTimelineQuery } = useAppShare();
  const customShareLoading = ref(false);
  const stopWatch = watchEffect(async () => {
    const v1 = customShareLoading.value;
    const v2 = supplyDemandDetailsResult.value;
    if (!v1 || !v2) return;
    setInternalLinkOptions({
      name: 'supplyDemandDetails',
      options: { id: v2.boInfoId },
    });
    const path = setWxSharePath({
      name: 'supplyDemandDetails',
      options: { id: v2.boInfoId },
    });

    const routeQuery = createShareQuery({ id: v2.boInfoId });
    await setWxShareOptions([getSupplyDemandWxShareData(v2, path)]);
    const { id: shareLogId } = await addAppShareLog({
      path: getUrl('supplyDemandDetails'),
      query: JSON.stringify(routeQuery),
    });
    setShareLogId(shareLogId);

    const codeImg = await createMiniCode({ shareLogId });
    const posterData = getSupplyDemandPosterData(v2, codeImg);
    await setPosterDrawData([posterData]);

    stopWatch();
  });

  onShareAppMessage(() => ({}));

  wx.hideShareMenu({
    menus: ['shareAppMessage', 'shareTimeline'],
  });
</script>

<style lang="scss" scoped></style>
